<template>
	<div class="exercises-task" v-loading.fullscreen.lock="loading"
		element-loading-text="拼命加载中">
		<div class="text-list-cont exercises-list-conten">

			<div class="question-bank-wp-r-h">

				  <div class="exercises-sort">
				  	  <el-radio-group v-model="homework.timestatus" @change="myHomework">
				  	     <el-radio-button label="-1">全部</el-radio-button>
				  	     <el-radio-button label="1">进行中</el-radio-button>
				  	     <el-radio-button label="0">已结束</el-radio-button>
				  	   </el-radio-group>
				  </div>

				  <el-input
				      placeholder="搜索试题"
				      suffix-icon="el-icon-search"
				      v-model="homework.keyword" @change="myHomework">
				    </el-input>
			</div>

			<ul>
				<template v-for="(item, index) of homeworkList">
				
					<li class="exercises-list-li" :key="index">

						<template>
							<div class="exercises-type-btn" v-if="item.answer_status === 0 && item._status === '进行中'"><a @click="lookTask(item)">做作业</a></div>
							<div class="exercises-type-btn" v-else><a @click="lookTask(item)">查看作业</a></div>
						</template>

						<template v-if="item.type <= 3">
							<a  v-if="item.answer_status === 0 && item._status === '进行中'" @click="changeHomework(item, 1)">{{item.name}}</a>
							<router-link  v-else-if="item.answer_status === 1 || item._status === '进行中'" :to="{path: '/exercises/task-result',query: {id: item.id}}">{{item.name}}</router-link>
							<router-link  v-else-if="item.answer_status === 0 || item._status === '已结束'" :to="{path: '/exercises/task-test',query: {id: item.id}}">{{item.name}}</router-link>
						</template>
						<template v-else-if="item.type == 4">
							<p @click="changeHomework(item, 2)" v-if="item.answer_status === 0 && item._status === '进行中'">{{item.name}}</p>
							<p @click="changeHomework(item, 4)" v-else-if="item.answer_status === 1 || item._status === '进行中'" >{{item.name}}</p>
							<p @click="changeHomework(item, 4)" v-else-if="item.answer_status === 0 || item._status === '已结束'">{{item.name}}</p>
						</template>
						<template v-else-if="item.type == 5">
							<p  @click="changeHomework(item, 2)" v-if="item.answer_status === 0 && item._status === '进行中'">{{item.name}}</p>
							<p  @click="changeHomework(item, 5)" v-else-if="item.answer_status === 1 || item._status === '进行中'">{{item.name}}</p>
							<p  @click="changeHomework(item, 5)" v-else-if="item.answer_status === 0 || item._status === '已结束'">{{item.name}}</p>
						</template>

						<ul  class="exercises-list-tips">
							<li v-if="item.subject_name">{{item.subject_name}}</li>
							<li v-if="item.user_name">{{item.user_name}}</li>
						</ul>


						<div class="exercises-list-li-timer">
							<div class="">
								<div>
									<span>更新于：</span>
									<span>{{item._update_time}}</span>
								</div>
								<div>
									<span>截止时间：</span>
									<span>{{item.end_time}}</span>
								</div>
							</div>
							<span class="exercises-list-state" v-if="item._status === '进行中'">进行中</span>
							<span class="exercises-list-state is-over"  v-if="item._status === '已结束'">已结束</span>
						</div>
						<template>
							<i v-if="item.answer_status == 1" class="el-icon-sunny" title='已完成'></i>
							<i v-if="item.answer_status == 0" class="el-icon-lightning" title="未完成"></i>
						</template>

						<template>
							<!-- 3.试卷，4.视频，5.课件 -->
							<i v-if="item.type <=  3" class="el-icon-tickets" title="试卷作业"></i>
							<i v-if="item.type === 4"  class="el-icon-video-play" title="视频作业"></i>
							<i v-if="item.type === 5"  class="el-icon-collection" title="课题作业"></i>
						</template>
						<i  v-if="item.is_praise ==  1" class="el-icon-bell" title="已批阅"></i>
					</li>
				</template>
			</ul>

			<div class="dependent" v-if="placeholder">
				<i class="ipng image_state01"></i>
				<p>还没发现任何相关的内容哦~</p>
			</div>


			<el-pagination class="test-pagination" v-if="homework.totalSum > homework.size"
				@size-change="sizeChange"
				@current-change="currentChange"
				:current-page="homework.page"
				:page-sizes="[10, 50, 100, 200, 300, 400]"
				:page-size="homework.size"
				layout="total, sizes, prev, pager, next, jumper"
				:total="homework.totalSum">
			</el-pagination>
		</div>
	</div>
</template>

<script>
	
	export default {
		data(){
			return {
				placeholder: false,
				loading: true,
				homeworkList: [],
				class: sessionStorage.getItem('classid') ? sessionStorage.getItem('classid') : 0, 
				homework: {
					page: 1,
					size: 12,
					totalSum: 0,
					keyword: '',
					order: 'time',
					timestatus: '1'
				}
			}
		},
		created(){
			this.myHomework()
		},
		methods: {
			/*做作业*/
			lookTask(obj){
				let host = sessionStorage.getItem( 'host' )
				let redirectParams = sessionStorage.getItem( 'redirect_params' )

				if (obj.resource_status != 1) {
					this.$message.error('该任务内容已被删除，无法打开')
					return 
				}
			

				if (obj.type <= 3) {/*试卷*/

					if (obj.answer_status === 0 && obj._status === '进行中') {

						this.$confirm('是否准备现在开始任务，点击确认即开始计时？', '开始', {
							cancelButtonText: '取消',
							confirmButtonText: '确定',
							type: 'info',
							customClass: "myHomework"
						}).then(() => {
							this.$router.push({path: '/exercises/task-test', query: {id: obj.id}})
						}).catch(() => {});

					}else if (obj.answer_status === 1 || obj._status === '进行中') {
						this.$router.push({path: '/exercises/task-result',query: {id: obj.id}})
					}else if(obj.answer_status === 0 && obj._status === '已结束'){
						this.$router.push({path: '/exercises/task-result',query: {id: obj.id}})
					}else if (obj.answer_status === 0 || obj._status === '已结束') {
						// this.$router.push({path: '/exercises/task-test',query: {id: obj.id}})
						this.$router.push({path: '/exercises/task-result',query: {id: obj.id}})
					}

				}else if (obj.type == 4) {/*视频*/
					if (obj.answer_status === 0 && obj._status === '进行中') {

						let success = ( res => {
							let data = res.data;
							let link = `${this.BASE_URL}${redirectParams}&host=${host}&routerUrl=/home/openclassDetail&id=${obj.resource_id}`
							window.open(link)

						});
						this.$ajax({
							url: 'api/task/resource_by_taskid',
							method: 'get',
							params: {classid:this.class, userid: this.$g.user_id, task_id: obj.id},
							func: {success: success}
						})

					}else if (obj.answer_status === 1 || obj._status === '进行中') {
						let link = `${this.BASE_URL}${redirectParams}&host=${host}&routerUrl=/home/openclassDetail&id=${obj.resource_id}`
						window.open(link)
					}else if (obj.answer_status === 0 || obj._status === '已结束') {
						let link = `${this.BASE_URL}${redirectParams}&host=${host}&routerUrl=/home/openclassDetail&id=${obj.resource_id}`
						window.open(link)
					}

				}else if (obj.type == 5){/*课件*/

					if (obj.answer_status === 0 && obj._status === '进行中') {

						let success = ( res => {
							let data = res.data;
							this.downloadFile(data, obj.resource_id);

						});
						this.$ajax({
							url: 'api/task/resource_by_taskid',
							method: 'get',
							params: {userid: this.$g.user_id,task_id: obj.id ,classid: this.class,},
							func: {success: success}
						})

					}else if (obj.answer_status === 1 || obj._status === '进行中') {
						let link = `${this.BASE_URL}${redirectParams}&host=${host}&routerUrl=/home/resourceDetail&id=${obj.resource_id}`
						window.open(link)
					}else if (obj.answer_status === 0 || obj._status === '已结束') {
						let link = `${this.BASE_URL}${redirectParams}&host=${host}&routerUrl=/home/resourceDetail&id=${obj.resource_id}`
						window.open(link)
					}
				}
			},
			/**
			 * 是否要开始做作业
			 * @DateTime 2019-08-21T09:17:42+0800
			 * @return   {[type]}                 [description]
			 */
			changeHomework(obj, type){

				let host = sessionStorage.getItem( 'host' )
				let redirectParams = sessionStorage.getItem( 'redirect_params' )

				switch(type){
					case 1:
						this.$confirm('是否准备现在开始任务，点击确认即开始计时？', '开始', {
							cancelButtonText: '取消',
							confirmButtonText: '确定',
							type: 'info',
							customClass: "myHomework"
						}).then(() => {
							this.$router.push({path: '/exercises/task-test', query: {id: obj.id}})

							
						}).catch(() => {});
					break;
					case 2:
						let success = ( res => {
							let data = res.data;
							if (obj.type == 4) {
								link = `${this.BASE_URL}${redirectParams}&host=${host}&routerUrl=/home/openclassDetail&id=${obj.resource_id}`
								window.open(link)
							}else{
								this.downloadFile(data, obj.resource_id);
							}
							
						});
						this.$ajax({
							url: 'api/task/resource_by_taskid',
							method: 'get',
							params: {
								class_id: this.class,
								userid: this.$g.user_id,
								task_id: obj.id
							},
							func: {
								success: success
							}
						})
					break;
					case 4:
						link = `${this.BASE_URL}${redirectParams}&host=${host}&routerUrl=/home/openclassDetail&id=${obj.resource_id}`
						window.open(link)
					break;
					case 5:
						link = `${this.BASE_URL}${redirectParams}&host=${host}&routerUrl=/home/resourceDetail&id=${obj.resource_id}`
						window.open(link)
					break;
				}
			},
			/**
			 * 课件下载
			 * @DateTime 2019-08-27T17:53:28+0800
			 * @param    {[type]}                 path [description]
			 * @param    {[type]}                 id   [description]
			 * @return   {[type]}                      [description]
			 */
			downloadFile(path,id){
				var form = document.createElement("form");
				form.action = this.BASE_URL+path;
				form.method = 'post';
				form.style.display = "none";
				
				var opt_name = document.createElement("textarea");
				opt_name.name = 'id';
				opt_name.value = id;
				form.appendChild(opt_name);
				document.body.appendChild(form);
				form.submit();
				document.body.removeChild(form);
			},

			/**
			 * 请求 我的作业
			 * @DateTime 2019-08-19T11:08:43+0800
			 * @return   {[type]}                 [description]
			 */
			myHomework(){
				if (this.homework.keyword != '') {
					this.homework.page = 1
				}
				let success = (res=>{
					this.homeworkList = res.data.data;
					this.homework.page = parseInt(res.data.page_index);
					this.homework.totalSum = parseInt(res.data.data_sum);
					this.homeworkList.length != 0 ? this.placeholder = false : this.placeholder = true;
					this.loading = false
				});

				let params = {
					class_id: sessionStorage.getItem('classid') ? sessionStorage.getItem('classid') : 0,
					order: this.homework.order,
					userid: this.$g.user_id,
					page_index: this.homework.page,
					page_size:  this.homework.size,
					timestatus:this.homework.timestatus,
					keyword: this.homework.keyword,
				};

				this.$ajax({
					url: 'api/task/receive_task_data',
					method: 'get',
					params: params,
					func: {success: success}
				})
			},
			sizeChange(val) {
				this.homework.page = 1
				this.homework.size = val;
				this.myHomework()
			},
			currentChange(val) {
				this.homework.page = val;
				this.myHomework()
			}
		}
	}
</script>